// var CommonHeader = Vue.extend({
//     template: "<header>我是网站头部 {{ message }}  -by {{ username }}</header>",
//     props: ['username']，
//     data: function () {
//         return {
//             message: "I am message!"
//         }
//     },
//     mounted() {
//         // this.$nextTick().then(() => {
//         console.log(123)
//         // })
//     }
// });
// var header = new CommonHeader({
//     propsData: { // 通过propsData传参
//         username: "wss"
//     }
// });// 要替换的元素
// new Vue({
//     el: '#app',
// })

var test = Vue.extend({
    template: '<div>{{msg|my-filter}}</div>',
    data: function () {
        return {
            msg: 1
        }
    },
    mounted: function () {
        this.$nextTick().then(() => {
            console.log('nextTick')
        })
    }
})
var myFilter = Vue.filter('my-filter', function (value) {
    // 返回处理后的值
    return value + 1
})

Vue.component('my-component', {
    name: 'component',
    template: '<div @click="fn">{{arr}}</div>',
    data: function () {
        return {
            count: 0,
            foo: '8527',
            arr: [{a:1,b:2},234]
        }
    },
    methods: {
        fn() {
            this.arr = 5
            console.dir(this.arr)
        },
    }
})

// getter，返回已注册的过滤器
console.log('myFilter', myFilter(2))

let vue = new Vue({
    el: '#app',
    components: {
        test: test,
    }
})